<!DOCTYPE html>
<html>
  <head>
    <title>EnterpriseJS</title>
    <script src="/page.js"></script>
  </head>
  <body>
    <h1>EnterpriseJS</h1>
    <p></p>
    <ul>
      <li><a href="./">/</a></li>
      <li><a href="./about">/about</a></li>
      <li><a href="./contact">/contact</a></li>
    </ul>

    <script>
      // if you're scared by non-"classes":

      function Router(obj) {
        var self = this;
        page.base('/enterprisejs');

        // define routes
        for (var key in obj) {
          if ('string' == typeof obj[key]) {
            ;(function(route, fn){
              page(key, function(){
                fn.apply(self, arguments);
              });
            })(key, obj[obj[key]]);
          }
        }

        this.render = function(text){
          document.querySelector('p').textContent = text;
        };

        this.start = page;
      }

      var router = new Router({
        '/': 'index',
        '/about': 'about',
        '/contact': 'contact',
        index: function(){ this.render('viewing index') },
        about: function(){ this.render('viewing about') },
        contact: function(){ this.render('viewing contact') }
      }).start();

    </script>
  </body>
</html>